<style lang="less">
    @import '../../../../styles/common.less';

    .ivu-page-options-sizer {
        width: 100px;
    }
    .interface:hover {
        color: red;
    }

</style>
<template>
    <div>
        <div v-if="indexPage">
            <Row class="margin-top-10">
                <Col span="24">
                    <Card>
                        <Row>
                            <!--<Col span="6">-->
                                <!--用户名称：-->
                                <!--<Input v-model="searchData.caseName" placeholder="请输入用户名称" style="width:50%"></Input>-->
                            <!--</Col>-->
                            <Col >
                                <Button type="primary" @click="projectSwitch">切换项目</Button>
                            </Col>
                        </Row>
                    </Card>
                </Col>
            </Row>
            <Row>
                <Col span="24">
                    <Card>
                        <p slot="title">接口测试</p>
                        <Row class="margin-bottom-10">
                            <Col span="2" style="width: 80px;">
                                <Button type="primary" @click="modalAddDisplay" icon="network">添加</Button>
                            </Col>
                            <!--<Col span="2" style="width: 100px;">-->
                                <!--<Button type="info" @click="modalAutoDisplay" :loading="autoTestLoading" icon="plus">自动测试</Button>-->
                            <!--</Col>-->
                            <!--<Col span="2" style="width: 100px;margin-left: 10px">-->
                                <!--<Button type="info" @click="modalAutoDisplay" :loading="autoTestLoading" icon="minus">自动测试</Button>-->
                            <!--</Col>-->
                            <Col span="2" style="width: 100px;margin-left: 20px">
                                <Button type="primary" @click="modalTestDisplay" :loading="testCaseLoading">手动测试</Button>
                            </Col>
                            <Col span="10" style="width: 150px;">
                                <Input v-model="testCaseMsg" placeholder="测试用例结果提醒"></Input>
                            </Col>
                        </Row>
                        <div style="min-width:1000px">
                            <Row style="display: flex;flex-direction: row">

                                <Row style="min-width: 230px;margin-right: 10px">
                                    <Row>
                                        <Input @on-change="groupNameOnChange" v-model="groupName" placeholder="请输入分组名称搜索" ></Input>
                                    </Row>
                                    <Tree :data="blockTree" :render="renderContent" @on-toggle-expand="treeExpand"></Tree>
                                </Row>
                                <!-- 右侧内容区域 -->
                                <Row style="min-width: 800px;margin-left: 10px">
                                    <div v-if="!addShow" style="border: 1px solid #e0e0e0; min-height: 100vh;padding: 30px">
                                        <div v-if="responseData">
                                            <Row>
                                                <Col span="2" style="width: 80px">测试总数：</Col>
                                                <Col span="1">{{responseData.num}}</Col>
                                                <Col span="2" style="width: 80px">通过数量：</Col>
                                                <Col span="1">{{responseData.success_num}}</Col>
                                                <Col span="2" style="width: 80px">失败数量：</Col>
                                                <Col v-if="!responseData.error_num" span="1">{{responseData.error_num}}</Col>
                                                <Col v-else span="1" style="color: red">{{responseData.error_num}}</Col>
                                            </Row>
                                            <Row>
                                                <Col span="2" style="width: 80px;margin-top: 10px">结果返回：</Col>
                                                <Col span="20">
                                                    <Row v-for="item in responseData.data_list" style="margin-top: 10px;">
                                                        <Row v-if="item.if_success === 1" style="border-bottom: 1px solid #e0e0e0;padding: 5px">
                                                            <Col span="2" style="width: 80px">接口名称：</Col>
                                                            <Col span="4" style="min-width: 80px">{{item.name}}</Col>
                                                            <Col span="2" style="width: 80px">时间：</Col>
                                                            <Col span="3" style="width: 180px">{{item.create_date}}</Col>
                                                            <Col span="1" style="width: 80px;color: #37ff5b">成功</Col>
                                                        </Row>
                                                        <Row v-if="item.if_success === 0" style="border: 1px solid #e0e0e0;padding: 5px">
                                                            <Row>
                                                                <Col span="2" style="width: 80px">接口名称：</Col>
                                                                <Col span="4" style="min-width: 80px">{{item.name}}</Col>
                                                                <Col span="2" style="width: 80px">时间：</Col>
                                                                <Col span="3" style="width: 180px">{{item.create_date}}</Col>
                                                                <Col span="1" style="width: 80px;color: #ff2845">失败</Col>
                                                            </Row>
                                                            <Row style="margin-top: 10px;">
                                                                <Col span="2" style="width: 80px">错误信息：</Col>
                                                                <Col span="22"><pre>{{item.result_data}}</pre></Col>
                                                            </Row>
                                                        </Row>
                                                    </Row>
                                                </Col>
                                            </Row>
                                        </div>
                                    </div>
                                    <add
                                            v-if="addShow"
                                            :detailData="detailData"
                                            :historyDate="historyDate"
                                            :blockFlag="blockFlag"
                                            :blockId="blockId"
                                            :projectId="projectId"
                                    ></add>
                                </Row>
                                <!--<Col span="20" class="edittable-table-height-con">-->
                                    <!--<Table-->
                                            <!--border :context="self"-->
                                            <!--:columns="table_data.header"-->
                                            <!--:data="table_data.data"-->
                                            <!--@on-sort-change="tableSort"-->
                                    <!--&gt;</Table>-->
                                <!--</Col>-->
                                <!--<Col span="20" class="margin-top-10">-->
                                    <!--<Page-->
                                            <!--:total="table_data.count"-->
                                            <!--class="float-right"-->
                                            <!--show-total-->
                                            <!--show-sizer-->
                                            <!--show-elevator-->
                                            <!--@on-change="updateTableCurrentPage"-->
                                            <!--@on-page-size-change="updateTablePageLength"-->
                                            <!--:page-size-opts="[10, 25, 50, 100]"-->
                                    <!--&gt;</Page>-->
                                <!--</Col>-->
                            </Row>
                        </div>
                        <!--<add @closeAddPage="closeAddPage" v-else-if="addPage"></add>-->
                    </Card>
                </Col>
            </Row>
        </div>

        <modalShow @updateProjectId="getProjectId" v-if="isModalShow" @hideModal="closeProjectSwitch" ></modalShow>

        <Modal
                v-model="modalAdd"
                title="添加接口"
                width="30%"
                :mask-closable="false"
        >

            <Form ref="AddformValidate" :model="modalData.Add.formValidate" :rules="modalData.Add.ruleValidate" :label-width="100">
                <Form-item label="接口名称" prop="caseName" :error="modalData.Add.formItemError.caseName">
                    <Input v-model="modalData.Add.formValidate.caseName" placeholder="请输入接口名称"></Input>
                </Form-item>
                <Form-item prop="ownershipGroup_id" label="分组名称" :error="modalData.Add.formItemError.ownershipGroup_id">
                    <Select v-model="modalData.Add.formValidate.ownershipGroup_id" placeholder="请选择分组名称" >
                        <Option v-for="item in superGroupName" :value="item.id" :key="item.id">{{item.name}}</Option>
                    </Select>
                </Form-item>
                <Form-item prop="type_status" label="接口类型" :error="modalData.Add.formItemError.type_status">
                    <Select v-model="modalData.Add.formValidate.type_status" placeholder="请选择接口类型">
                        <Option v-for="item in interfaceType" :value="item.id" :key="item.id">{{item.name}}</Option>
                    </Select>
                </Form-item>
            </Form>
            <div slot="footer">
                <Button @click="modalAdd=false; modalData.Add.loading=false">取消</Button>
                <Button type="primary" :loading="modalData.Add.loading" @click="modalAddFunc">添加</Button>
            </div>

        </Modal>

        <Modal
                v-model="modalAuto"
                title="添加自动测试任务"
                width="30%"
                :mask-closable="false"
        >
            <Form ref="AutoformValidate" :model="modalData.Auto.formValidate" :rules="modalData.Auto.ruleValidate" :label-width="100">
                <Form-item label="分组名称">
                    <template>
                        <Tree ref="treeAuto" :data="modalData.Auto.formValidate.blockTree" show-checkbox></Tree>
                    </template>
                </Form-item>
                <Form-item prop="run_type" label="运行类型" :error="modalData.Auto.formItemError.run_type">
                    <Select v-model="modalData.Auto.formValidate.run_type" placeholder="请选择运行类型" @on-change="runTypeChange">
                        <Option v-for="item in runTypeChoisesData" :value="item[0]" :key="item[0]">{{item[1]}}</Option>
                    </Select>
                </Form-item>
                <Form-item v-if="runTypeShow1" label="运行时间" prop="expect_run_time" :error="modalData.Auto.formItemError.expect_run_time">
                    <Input v-model="modalData.Auto.formValidate.expect_run_time" placeholder="每天几点执行（09:00:00）"></Input>
                </Form-item>
                <Form-item v-if="runTypeShow2" label="运行时间段" prop="expect_time" :error="modalData.Add.formItemError.expect_time">
                    <Input v-model="modalData.Auto.formValidate.expect_time" placeholder="多久执行一次（20）分钟"></Input>
                </Form-item>
            </Form>

            <div slot="footer">
                <Button @click="modalAuto = false ; modalData.Auto.loading = false">取消</Button>
                <Button type="primary" :loading="modalData.Auto.loading" @click="autoTestSave">提交</Button>
            </div>
        </Modal>

        <Modal
                v-model="modalTest"
                title="选择分组"
                width="30%"
                :mask-closable="false"
        >
            <Form ref="UpdateformValidate" :model="modalData.Test.formValidate" :rules="modalData.Test.ruleValidate" :label-width="100">
                <Form-item label="分组名称">
                    <template>
                        <Tree ref="treeTest" :data="modalData.Test.formValidate.blockTree" show-checkbox></Tree>
                    </template>
                </Form-item>
            </Form>

            <div slot="footer">
                <Button @click="modalTest = false ; modalData.Test.loading = false">取消</Button>
                <Button type="primary" :loading="modalData.Test.loading" @click="testCase">开始测试</Button>
                <!--<Button type="primary" :loading="modalData.Test.loading" @click="testCaseSave">测试/生成文档</Button>-->
            </div>
        </Modal>
    </div>

</template>

<script>
    import util from '../../../../libs/util';
    import qs from 'qs';
    import modalShow from './modalShow';
    import add from './add';
    export default {
        name: 'index',
        data () {
            return {
                bgFlag: {},
                treeExpandData: [], // 左侧树形图当前展开的id
                indexPage: true, // 初始页面
                addShow: false, // 接口内容区域
                responseData: '', // 测试用例返回数据
                isModalShow: false, // 点击切换项目，弹出模态框
                modalTest: false, // 是否显示模态对话框
                testCaseMsg: '', // 测试用例结果提醒
                generate: '', // 测试用例是否生成文档
                runTypeChoisesData: [], // 自动测试 -- 运行类型
                runTypeShow1: true, // 运行时间显示与隐藏
                runTypeShow2: false, // 运行时间段显示与隐藏
                autoTestLoading: false, // 自动测试按钮loading
                modalAuto: false, // 是否显示自动测试模态对话框
                testCaseLoading: false, // 测试用例按钮loading
                modalAdd: false, // 是否显示模态对话框
                groupName: '', // 分组名称搜索
                modalData: {
                    Add: {
                        formValidate: {
                            caseName: '',
                            ownershipGroup_id: '',
                            type_status: ''
                        },
                        ruleValidate: {
                            caseName: [
                                { required: true, message: '接口名称不能为空', trigger: 'blur' }
                            ]
                        },
                        formItemError: {
                            caseName: '',
                            ownershipGroup_id: '',
                            type_status: ''
                        },
                        loading: false
                    },
                    Test: {
                        formValidate: {
                            blockTree: []
                        },
                        ruleValidate: {
                        },
                        formItemError: {
                        },
                        loading: false
                    },
                    Auto: {
                        formValidate: {
                            blockTree: [],
                            run_type: 1,
                            expect_run_time: '',
                            expect_time: ''
                        },
                        ruleValidate: {
                            expect_run_time: [
                                { required: true, message: '运行时间不能为空', trigger: 'blur' }
                            ],
                            expect_time: [
                                { required: true, message: '运行时间段不能为空', trigger: 'blur' }
                            ]
                        },
                        formItemError: {
                            blockTree: '',
                            run_type: '',
                            expect_run_time: '',
                            expect_time: ''
                        },
                        loading: false
                    }
                },
                searchData: {
                    caseName: ''
                },
                superGroupName: [], // 所有上级分组名称数据
                blockId: '', // 左侧树状图的分组 id
                blockTree: [], // 左侧树状图数据
                projectId: null, // 选择项目的ID
                interfaceType: [], // 接口类型数据
                detailData: [], // 接口详情数据
                historyDate: [], // 接口请求历史数据
                blockFlag: false,
                self: this,
                table_data: {
                    header: [
                        {
                            title: '编号',
                            type: 'index',
                            width: 60,
                            align: 'center'
                        },
                        {
                            title: '接口名称',
                            align: 'center',
                            key: 'jieKouName'
                        },
                        {
                            title: '请求方式',
                            key: 'requestType',
                            align: 'center'
                        },
                        {
                            title: '接口地址',
                            align: 'center',
                            key: 'url'
                        },
                        {
                            title: '创建人',
                            align: 'center',
                            key: 'username'
                        },
                        {
                            title: '创建时间',
                            align: 'center',
                            key: 'create_date',
                            sortable: 'custom',
                            render: (h, params) => {
                                let createDate = params.row.create_date ? params.row.create_date.replace('T', ' ') : '';
                                return h('span', createDate);
                            }
                        },

                        {
                            title: '操作',
                            key: 'action',
                            width: 200,
                            align: 'center',
                            render: (h, params) => {
                                return [
                                    h('Button', {
                                        props: {
                                            type: 'warning',
                                            size: 'small',
                                            icon: 'edit'
                                        },
                                        on: {
                                            'click': () => {
                                                // 弹出修改模态对话框
                                                this.$refs['UpdateformValidate'].resetFields();
                                                this.modalUpdate = true;
                                                this.modalData.Update.formValidate.caseName = params.row.jieKouName;
                                                this.modalData.Update.formValidate.requestType = params.row.requestType;
                                                this.modalData.Update.formValidate.url = params.row.url;
                                                this.modalData.Update.formValidate.id = params.row.id;
                                            }
                                        }
                                    }, '修改'),
                                    h('Poptip', {
                                        props: {
                                            confirm: true,
                                            title: '您确定要删除这条数据吗?',
                                            transfer: true
                                        },
                                        on: {
                                            'on-ok': () => {
                                                let id = params.row.id;
                                                util.ajax.post('api/testCaseDetaile/delete/' + id).then(res => {
                                                    if (res.data.code === 200) {
                                                        this.$Notice.success({
                                                            title: '删除成功',
                                                            duration: 2
                                                        });
                                                        this.initData();
                                                    } else {
                                                        // 添加失败
                                                        this.$Notice.success({
                                                            title: res.data.msg,
                                                            duration: 2
                                                        });
                                                    }
                                                });
                                            }
                                        }
                                    }, [
                                        h('Button', {
                                            props: {
                                                type: 'error',
                                                size: 'small',
                                                icon: 'trash-b'
                                            },
                                            style: {
                                                margin: '0 5px'
                                            }
                                        }, '删除')]
                                    )
                                ];
                            }
                        }
                    ],
                    data: [],
                    count: 0,
                    length: 10,
                    current_page: 1,
                    order: '-create_date'
                }
            };
        },
        components: {
            modalShow, add
        },

        methods: {
            // 分组名称搜索框改变时
            groupNameOnChange (e) {
                // console.log('eeeeeee', e.target.value);
                this.groupName = e.target.value;
                this.getBlockTree();
            },
            // 找出对应值value 在数组 a 中的下标
            contains (a, value) {
                let i = a.length;
                while (i--) {
                    if (a[i] === value) {
                        return i;
                    }
                }
                return false;
            },
            // 树形图展开收起是触发
            treeExpand (e) {
                console.log('treeExpand-->', e);
                if (e.expand) {
                    this.treeExpandData.push(e.id);
                    // 过滤数组里重复的id
                    this.treeExpandData = this.treeExpandData.filter(function (element, index, self) {
                        return self.indexOf(element) === index;
                    });
                } else {
                    this.treeExpandData.splice(this.contains(this.treeExpandData, e.id), 1);
                }
                console.log('this.treeExpandData', this.treeExpandData);
                localStorage.treeExpandData = JSON.stringify(this.treeExpandData);
            },
            // 自定义树形图内容
            renderContent (h, { root, node, data }) {
                let icon = data.children && data.children.length > 0 ? 'ios-folder' : null;
                if (!data.file) {
                    icon = 'network';
                    this.bgFlag[node.nodeKey] = false;
                }
                return h('span', {
                    style: {
                        // display: 'inline-block',
                        width: '100%',
                        minHeight: '30px',
                        backgroundColor: this.bgFlag[node.nodeKey] ? '#d5e8fc' : null
                    },
                    on: {
                        'click': () => {
                            console.log('自定义树形图data-->', node);
                            console.log('自定义树形图this.blockTree-->', this.blockTree);
                            if (!data.file) {
                                this.bgFlag[node.nodeKey] = !this.bgFlag[node.nodeKey];
                                this.blockId = data.id;
                                this.itinterfaceData();
                                this.addShow = true;
                                console.log('node -->', node);
                            }
                        }
                    }
                }, [
                    h('span', [
                        h('Icon', {
                            props: {
                                type: icon
                            },
                            style: {
                                marginRight: '8px'
                            }
                        }),
                        h('span', {
                            // style: {
                            //     backgroundColor: 'red'
                            // }
                        }, data.title)
                    ]),
                    !data.file ? (
                        h('Poptip', {
                            props: {
                                confirm: true,
                                title: '您确定要删除该接口吗?',
                                transfer: true
                            },
                            on: {
                                'on-ok': () => {
                                    util.ajax.post('api/testCaseDetaile/delete/' + data.id).then(res => {
                                        if (res.data.code === 200) {
                                            this.modalAdd = false;
                                            this.$Notice.success({
                                                title: '删除成功',
                                                duration: 2
                                            });
                                            this.getBlockTree();
                                            this.getGroupTree();
                                        } else {
                                            // 添加失败
                                            console.log('删除失败 -->', res.data);
                                            this.$Notice.error({
                                                title: res.data.msg,
                                                duration: 5
                                            });
                                        }
                                    });
                                }
                            }
                        }, [
                            h(
                                'Button',
                                {
                                    props: {
                                        size: 'small',
                                        icon: 'trash-b'
                                    },
                                    style: {
                                        marginLeft: '20px'
                                    }
                                }
                            )]
                        )
                    ) : null
                ]);
            },
            // 右侧的接口数据
            itinterfaceData () {
                let params = {
                    'id': this.blockId,
                    'beforeTaskId': this.projectId
                };
                util.ajax.get('api/testCaseDetaile', {params: params}).then(res => {
                    if (res.data.code === 200) {
                        console.log('右侧的接口数据---res.data-->', res.data.data.ret_data[0]);
                        this.detailData = res.data.data.ret_data[0];
                        this.historyDate = res.data.data.history_date;
                        this.blockFlag = true;
                        util.updateFlag = true;
                    } else {
                        // 登录失败
                        console.log('获取内容异常');
                    }
                });
            },
            // 初始化数据
            initData () {
                let params = {
                    'talk_project_id': this.projectId
                };
                util.ajax.get('api/testCaseGroup/superGroupName/0', {params: params}).then(res => {
                    if (res.data.code === 200) {
                        this.superGroupName = res.data.data.data_list;
                    } else {
                        // 登录失败
                        console.log('获取内容异常');
                    }
                });
                util.ajax.get('api/testCaseDetaile/get_choices/0').then(res => {
                    if (res.data.code === 200) {
                        this.interfaceType = res.data.data.jiekouTypeData;
                    } else {
                        // 登录失败
                        console.log('获取内容异常');
                    }
                });
                util.ajax.get('api/testCaseDetaile/get_timing_case_result/0').then(res => {
                    if (res.data.code === 200) {
                        this.runTypeChoisesData = res.data.data.run_type_choises;
                    } else {
                        // 登录失败
                        console.log('获取内容异常');
                    }
                });
            },
            // 增加
            modalAddFunc () {
                this.modalData.Add.loading = true;
                // 初始化所有字段错误信息的值
                for (let key in this.modalData.Add.formItemError) {
                    this.modalData.Add.formItemError[key] = '';
                }
                this.$refs['AddformValidate'].validate((valid) => {
                    if (valid) {
                        let params = {
                            'ownershipGroup_id': this.modalData.Add.formValidate.ownershipGroup_id,
                            'type_status': this.modalData.Add.formValidate.type_status,
                            'caseName': this.modalData.Add.formValidate.caseName
                        };

                        util.ajax.post('api/testCaseDetaile/add/0', qs.stringify(params)).then(res => {
                            if (res.data.code === 200) {
                                this.modalAdd = false;
                                this.$Notice.success({
                                    title: '添加成功',
                                    duration: 2
                                });
                                this.getBlockTree();
                                this.getGroupTree();
                            } else {
                                // 添加失败
                                for (let key in res.data.msg) {
                                    this.modalData.Add.formItemError[key] = res.data.msg[key][0].message;
                                    // console.log('11111111111111111-->', res.data.msg[key][0].message);
                                }
                            }
                            this.modalData.Add.loading = false;
                        });
                    } else {
                        this.modalData.Add.loading = false;
                    }
                });
            },
            // 修改
            modalUpdateFunc () {
                this.modalData.Update.loading = true;

                // 初始化所有字段错误信息的值
                for (let key in this.modalData.Update.formItemError) {
                    this.modalData.Update.formItemError[key] = '';
                }

                this.$refs['UpdateformValidate'].validate((valid) => {
                    if (valid) {
                        let params = {
                            'caseName': this.modalData.Update.formValidate.caseName,
                            // 'requestType': this.modalData.Update.formValidate.requestType,
                            // 'url': this.modalData.Update.formValidate.url
                        };

                        util.ajax.post('api/testCaseDetaile/update/' + this.modalData.Update.formValidate.id, qs.stringify(params)).then(res => {
                            if (res.data.code === 200) {
                                console.log('修改成功 -->', res.data);
                                this.modalUpdate = false;
                                this.$Notice.success({
                                    title: '修改成功',
                                    duration: 2
                                });
                                this.initData();
                            } else {
                                // 修改失败
                                this.$Notice.success({
                                    title: res.data.msg,
                                    duration: 2
                                });
                                for (let key in res.data.msg) {
                                    this.modalData.Update.formItemError[key] = res.data.msg[key][0].message;
                                }
                            }

                            this.modalData.Update.loading = false;
                        });
                    } else {
                        // this.$Message.error('表单验证失败!');
                        this.modalData.Update.loading = false;
                    }
                });
            },
            // 获取左侧树形图的信息
            getBlockTree () {
                let params = {
                    'beforeTaskId': this.projectId,
                    'search_msg': this.groupName,
                    'get_expand': localStorage.treeExpandData
                };
                util.ajax.get('api/testCaseDetaile/blockTree/0', {params: params}).then(res => {
                    if (res.data.code === 200) {
                        this.blockTree = res.data.data.result;
                        console.log('树形图数据-->', res.data.data.result);
                    } else {
                        // 登录失败
                        console.log('获取内容异常');
                    }
                });
            },
            // 获取只有分组的树形图
            getGroupTree () {
                let params = {
                    'beforeTaskId': this.projectId
                };
                util.ajax.get('api/testCaseDetaile/treeGroup/0', {params: params}).then(res => {
                    if (res.data.code === 200) {
                        this.modalData.Test.formValidate.blockTree = res.data.data.result;
                        this.modalData.Auto.formValidate.blockTree = res.data.data.result;
                    } else {
                        // 登录失败
                        console.log('获取内容异常');
                    }
                });
            },
            // 表格排序触发
            tableSort (e) {
                let key = e.key;
                let order = e.order;

                if (order === 'desc') {
                    this.table_data.order = '-' + key;
                } else {
                    this.table_data.order = key;
                }
                this.initData();
            },
            // 当页码被改变是触发
            updateTableCurrentPage (currentPage) {
                this.table_data.current_page = currentPage;
                this.initData();
            },
            // 修改每页显示数量
            updateTablePageLength (length) {
                this.table_data.length = length;
                this.initData();
            },
            // 获取模态对话框中选择项目ID
            getProjectId (projectId, modalShow) {
                console.log('获取模态对话框中选择项目ID-->', projectId, modalShow);
                this.projectId = projectId;
                this.isModalShow = modalShow;
            },
            // 点击切换项目时
            projectSwitch () {
                console.log('123123123-->');
                this.isModalShow = true;
            },
            // 关闭切换项目模态框
            closeProjectSwitch () {
                this.isModalShow = false;
            },
            // 弹出添加
            modalAddDisplay () {
                this.modalAdd = true;
                this.$refs['AddformValidate'].resetFields();
            },
            // 弹出测试用例模态框
            modalTestDisplay () {
                this.modalTest = true;
                this.$refs['UpdateformValidate'].resetFields();
            },

            // 弹出自动测试模态框
            modalAutoDisplay () {
                this.modalAuto = true;
                this.$refs['AutoformValidate'].resetFields();
            },
            // 自动测试 -- 运行类型选择框改变时
            runTypeChange (value) {
                console.log(value);
                if (value === 1) {
                    this.runTypeShow1 = true;
                    this.runTypeShow2 = false;
                    this.modalData.Auto.formValidate.expect_time = '';
                } else {
                    this.runTypeShow1 = false;
                    this.runTypeShow2 = true;
                    this.modalData.Auto.formValidate.expect_run_time = '';
                }
            },
            // 自动测试接口
            autoTestSave () {
                this.modalData.Auto.loading = true;
                // 初始化所有字段错误信息的值
                for (let key in this.modalData.Add.formItemError) {
                    this.modalData.Auto.formItemError[key] = '';
                }
                this.$refs['AutoformValidate'].validate((valid) => {
                    if (valid) {
                        let flag = false;
                        let selectedObjs = this.$refs.treeAuto.getCheckedNodes();
                        let caseList = [];
                        for (let i = 0; i < selectedObjs.length; i++) {
                            caseList.push(selectedObjs[i].id);
                        }
                        if (caseList.length > 0) {
                            flag = true;
                        } else {
                            this.modalData.Auto.loading = false;
                            this.$Notice.error({
                                title: '请选择分组名称',
                                duration: 2
                            });
                        }
                        if (flag) {
                            let params = {
                                'case_inter_result': JSON.stringify(caseList),
                                'run_type': this.modalData.Auto.formValidate.run_type,
                                'expect_run_time': this.modalData.Auto.formValidate.expect_run_time,
                                'expect_time': this.modalData.Auto.formValidate.expect_time
                            };
                            util.ajax.post('/api/testCaseDetaile/add_timing_case/0', qs.stringify(params)).then(res => {
                                if (res.data.code === 200) {
                                    this.modalAuto = false;
                                    this.initData();
                                } else {
                                    // 失败
                                    for (let key in res.data.msg) {
                                        this.modalData.Auto.formItemError[key] = res.data.msg[key][0].message;
                                    }
                                }
                                this.modalData.Auto.loading = false;
                            });
                        }
                    } else {
                        this.modalData.Auto.loading = false;
                    }
                });
            },
            // 测试用例接口
            testCase () {
                let flag = false;
                this.addShow = false;
                this.modalData.Test.loading = true;
                let selectedObjs = this.$refs.treeTest.getCheckedNodes();
                let caseList = [];
                for (let i = 0; i < selectedObjs.length; i++) {
                    caseList.push(selectedObjs[i].id);
                }
                if (caseList.length > 0) {
                    flag = true;
                } else {
                    this.modalData.Test.loading = false;
                    this.$Notice.error({
                        title: '请选择分组名称',
                        duration: 2
                    });
                }
                if (flag) {
                    let params = {
                        'talk_project_id': localStorage.projectId,
                        'case_id_list': JSON.stringify(caseList),
                        'is_generate': this.generate
                    };
                    util.ajax.post('/api/startTestCase', qs.stringify(params)).then(res => {
                        if (res.data.code === 200) {
                            setTimeout(() => {
                                clearInterval(this.timer);
                            }, 1000);
                        } else {
                            this.testCaseMsg = '出错了！！！' + res.data.msg;
                        }
                        this.modalTest = false;
                        this.generate = '';
                    });
                    this.timer = setInterval(() => {
                        this.timerResult();
                    }, 1000);
                    this.modalData.Test.loading = false;
                } else {
                    this.modalData.Test.loading = false;
                }
            },
            // 测试并保存
            testCaseSave () {
                this.generate = 1;
                this.testCase();
            },
            // 定时器刷新测试结果
            timerResult () {
                let params = {
                    'beforeTaskId': this.projectId
                };
                util.ajax.get('api/testCaseDetaile/get_redis_result/0', {params: params}).then(res => {
                    if (res.data.code === 200) {
                        console.log('定时器刷新测试结果-->', res.data);
                        // this.blockTree = res.data.data.result;
                        this.testCaseMsg = res.data.msg;
                        this.responseData = res.data.data;
                    } else {
                        // 登录失败
                        console.log('获取内容异常');
                    }
                });
            }
        },
        created () {
            if (localStorage.projectId) {
                this.projectId = localStorage.projectId;
            } else {
                this.isModalShow = true;
            }
            this.treeExpandData = JSON.parse(localStorage.treeExpandData);
        },
        watch: {
            'projectId': function (val, oldVal) {
                if (val) {
                    this.initData();
                    this.getBlockTree();
                    this.getGroupTree();
                }
            }
        }

    };
</script>

